<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>资源管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../assets/layui/css/layui.css" media="all">
</head>
<body>
<fieldset class="layui-elem-field" style="padding-top: 10px;">
    <div class="layui-btn-group">
        <button class="layui-btn" data-type="doExpand">全部展开</button>
        <button class="layui-btn" data-type="doFold">全部折叠</button>
        <button class="layui-btn" id="btnSearch"  data-type="doRefresh">刷新</button>
        <button class="layui-btn" data-type="doAdd">添加</button>
    </div>
</fieldset>

<table id="tbData" class="layui-table" lay-filter="dataTable"></table>
<!-- 操作列 -->
<script type="text/html" id="oper-col">
    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit">修改</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

<script src="../assets/layui/layui.js"></script>
<script>
    layui.config({
        base: '../js/'
    }).extend({
        treetable: 'treetable-lay/treetable'
    });
    layui.use(['layer', 'table', 'common','treetable'], function () {
        var $ = layui.jquery,
            layer = layui.layer,
            table = layui.table,
            common= layui.common,
            treetable = layui.treetable,
            active ={
                doAdd:function () {
                    common.layer_show("资源新增",'ResourceEdit.html');
                },
                doExpand:function () {
                    treetable.expandAll('#tbData');
                },
                doFold:function () {
                    treetable.foldAll('#tbData');
                },
                doRefresh:function () {
                    renderTable();
                }
            };
        // 渲染表格
        var renderTable = function () {
            layer.load(2);
            treetable.render({
                treeColIndex: 1,
                treeSpid: 0,
                treeIdName: 'id',
                treePidName: 'parentId',
                treeDefaultClose: true,
                treeLinkage: false,
                elem: '#tbData',
                url: 'res/list?span='+new Date().Format("yyyyMMddHHmmss"),
                page: false,
                cols: [[
                    {type: 'numbers'},
//                    {field: 'id', title: 'id', width: 340, },
                    {field: 'name', title: '名称',width: 350, },
                      {field: 'type', title: '类型',width: 80,
                          templet:function (e) {
                              if(e.type==0) return '模块';
                              else if(e.type==1) return '菜单';
                              else if(e.type==2) return '按钮';
                              else return e.type;
                          }
                      },
                    {field: 'url', title: 'url',width: 350, },
                    {field: 'rank', title: '排序'},
//                    {field: 'icon', title: 'icon'},
                    {templet: '#oper-col', title: '操作',width: 150,}
                ]],
                done: function () {
                    layer.closeAll('loading');
                }
            });
        };
        renderTable();

        //监听工具条
        table.on('tool(dataTable)', function (obj) {
            var data = obj.data;
            var id = data.id;
            var layEvent = obj.event;

            if (layEvent === 'del') {
                layer.confirm('您确定删除该资源吗', function (index) {
                    $.ajax({
                        type: 'POST',
                        url: 'res/delete',
                        dataType: 'json',
                        data:{id:id},
                        success: function(rtn) {
                            if(rtn.code===0){
                                common.showMsg('操作成功!');
                                obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                            }
                            else{
                                common.showError("操作失败:" + rtn.msg);
                            }
                        },
                        error: function() {
                            common.showError("操作失败" );
                        }
                    });

                });
            } else if (layEvent === 'edit') {
                common.layer_show('资源编辑',"ResourceEdit.html?type=edit&id="+id);
            }
        });

        //按钮事件绑定
        $('.layui-btn').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    })

</script>
</body>
</html>
